import { login, getUserInfo, getUserDetailById } from '@/api/user'
import { getToken, setToken, removeToken } from '@/utils/auth'

export default {
  namespaced: true,
  state: {
    token: getToken() || '', // 这里初始值为空，刷新时所有代码都会重置
    userInfo: {}
  },
  mutations: {
    setToken(state, val) {
      // 存入vuex
      state.token = val
      // 存入cookie
      setToken(val)
      // 登录 -> 获取token -> 存入token
      // 刷新 -> 本地获取token -> 存入state token
    },
    setUserInfo(state, val) {
      state.userInfo = val
    },
    removeUserInfo(state) {
      // 清除vuex
      state.token = ''
      state.userInfo = {}
      // 清除本地
      removeToken()
    }
  },
  actions: {
    // async fetchLogin(ctx, data) {
    //   // ctx:上下文对象
    //   // ctx.commit : 提交mutation
    //   // ctx.dispatch ： 提交action
    //   const res = await login(data)
    //   ctx.commit('setToken', res)
    // }
    async fetchLogin({ commit }, data) {
      // 1.调用接口
      const res = await login(data)
      // 2.获取返回值，提交mutaion修改数据
      commit('setToken', res)
    },
    async fetchUserInfo({ commit }) {
      // 后端多个接口，对应前端一个业务，需要组合数据
      // 接口间，有前后依赖关系时，await 保证了串行结构
      const res = await getUserInfo()
      const detailRes = await getUserDetailById(res.userId)
      commit('setUserInfo', { ...res, ...detailRes })
    }
  }
}

